<template>
  <div class="task-end">
    <img alt="" src="https://lanhu-oss-2537-2.lanhuapp.com/SketchPngb97b303caa9ec59c8494cddca1ca855f8c273bc38d4f686e0eb1885976683b59"/>
    <div class="title">恭喜您! 测评已完成!</div>
    <div class="tips">报告正在生成中~</div>
    <div class="tips">请稍后去测评报告列表查看</div>
    <div style="margin-top: 48px;">
        <el-button type="default" @click="reReport">重新测评</el-button>
       <el-button type="primary"  @click="goHome">回到首页</el-button>
    </div>
  </div>
</template>
<script setup>
import { useRouter } from "vue-router";
import useTaskStore from '@/stores/task.js'
import { ElMessageBox } from 'element-plus';

const store = useTaskStore()

const router = useRouter();

const goHome = ()=> {
    router.push('/')
}

const reReport = async  ()=> {
  try {
      await ElMessageBox.confirm(
          '确定要重新测评吗？之前的测评数据将会被重置。',
          '警告',
          {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning',
          }
      );
      // 用户点击确定
      store.taskIndex = 0;
	  store.processIndex = 0
    } catch {
      // 用户点击取消或关闭对话框
      return false;
    }

}
</script>
<style scoped lang="scss">
.task-end {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: 40px;

  img {
    margin-bottom: 30px;
    width: 228px;
    aspect-ratio: 1/1;
  }

  .title {
    font-size: 28px;
    margin-bottom: 15px;
  }
  .tips{
    margin-bottom: 17px;
  }
}
</style>